qml rowLayout
-
want my window elements take the same height and width as the application window
I want like when i click on one of the button , it displays on the rectangle , Could you please explain me how to do it because i searched but i didn't really understand
i modify my code as many of you suggested but the probleme when i try marginleft property for the footer , nothing happened and my buttons aren't showing up , here is my code
import QtQuick 2 import QtQuick.Controls 2.15 import QtQuick.Controls.Material 2.15 import QtQuick.Layouts ApplicationWindow { id: applicationWindow property string displayedButton: "" width: 800 height: 380 visible: true Page { anchors.fill: parent RowLayout { anchors.fill: parent ListView { id: leftMenuBar Layout.preferredWidth: 90 Layout.fillHeight: true clip: true spacing: 10 model: 3 delegate: Button { text: "Button " + (index + 1) onClicked: displayedButton = text width: 90 height: 90 } Layout.alignment: Qt.AlignLeft Layout.leftMargin: 20 } Item { Layout.fillWidth: true Layout.fillHeight: true Rectangle { anchors.fill: parent anchors.margins: 20 border.width: 2 border.color: "lightgray" radius: 35 Text { anchors.centerIn: parent text: "Selected Button: " + displayedButton font.pixelSize: 20 } } } } footer: RowLayout{ ListView { id: bottomMenuBar implicitHeight: 90 clip:true orientation: ListView.Horizontal spacing: 10 Layout.preferredWidth:90 Layout.leftMargin:20 Repeater { model: 8 delegate: Button { text: "Button " + (index + 1) onClicked: displayedButton = text width: 90 height: 90 } } } } }And what i noticed when i made some modification , while i double click my window , button are displayed with random spacing , it that because i should use implicit height and width for them?
)
please if you could help me
-
want my window elements take the same height and width as the application window
I want like when i click on one of the button , it displays on the rectangle , Could you please explain me how to do it because i searched but i didn't really understand
i modify my code as many of you suggested but the probleme when i try marginleft property for the footer , nothing happened and my buttons aren't showing up , here is my code
import QtQuick 2 import QtQuick.Controls 2.15 import QtQuick.Controls.Material 2.15 import QtQuick.Layouts ApplicationWindow { id: applicationWindow property string displayedButton: "" width: 800 height: 380 visible: true Page { anchors.fill: parent RowLayout { anchors.fill: parent ListView { id: leftMenuBar Layout.preferredWidth: 90 Layout.fillHeight: true clip: true spacing: 10 model: 3 delegate: Button { text: "Button " + (index + 1) onClicked: displayedButton = text width: 90 height: 90 } Layout.alignment: Qt.AlignLeft Layout.leftMargin: 20 } Item { Layout.fillWidth: true Layout.fillHeight: true Rectangle { anchors.fill: parent anchors.margins: 20 border.width: 2 border.color: "lightgray" radius: 35 Text { anchors.centerIn: parent text: "Selected Button: " + displayedButton font.pixelSize: 20 } } } } footer: RowLayout{ ListView { id: bottomMenuBar implicitHeight: 90 clip:true orientation: ListView.Horizontal spacing: 10 Layout.preferredWidth:90 Layout.leftMargin:20 Repeater { model: 8 delegate: Button { text: "Button " + (index + 1) onClicked: displayedButton = text width: 90 height: 90 } } } } }And what i noticed when i made some modification , while i double click my window , button are displayed with random spacing , it that because i should use implicit height and width for them?
)
please if you could help me
Hi and welcome to devnet,
AFAIK, the way you try to use the footer is wrong. It's an horizontal area not an additional vertical space.
-
want my window elements take the same height and width as the application window
I want like when i click on one of the button , it displays on the rectangle , Could you please explain me how to do it because i searched but i didn't really understand
i modify my code as many of you suggested but the probleme when i try marginleft property for the footer , nothing happened and my buttons aren't showing up , here is my code
import QtQuick 2 import QtQuick.Controls 2.15 import QtQuick.Controls.Material 2.15 import QtQuick.Layouts ApplicationWindow { id: applicationWindow property string displayedButton: "" width: 800 height: 380 visible: true Page { anchors.fill: parent RowLayout { anchors.fill: parent ListView { id: leftMenuBar Layout.preferredWidth: 90 Layout.fillHeight: true clip: true spacing: 10 model: 3 delegate: Button { text: "Button " + (index + 1) onClicked: displayedButton = text width: 90 height: 90 } Layout.alignment: Qt.AlignLeft Layout.leftMargin: 20 } Item { Layout.fillWidth: true Layout.fillHeight: true Rectangle { anchors.fill: parent anchors.margins: 20 border.width: 2 border.color: "lightgray" radius: 35 Text { anchors.centerIn: parent text: "Selected Button: " + displayedButton font.pixelSize: 20 } } } } footer: RowLayout{ ListView { id: bottomMenuBar implicitHeight: 90 clip:true orientation: ListView.Horizontal spacing: 10 Layout.preferredWidth:90 Layout.leftMargin:20 Repeater { model: 8 delegate: Button { text: "Button " + (index + 1) onClicked: displayedButton = text width: 90 height: 90 } } } } }And what i noticed when i made some modification , while i double click my window , button are displayed with random spacing , it that because i should use implicit height and width for them?
)
please if you could help me
-
@San12 i am still a beginner in qml , footer i used it tp place my buttom bottons , how could i correct it ?
I would make the ListView horizontal. See the item documentation.